<template>
<view class="page room bgf7 c00">
	<view class="flex flexC flexB p14  bgff">
		<view class="flex1" @click="showShop">
			<text>门店筛选：{{selectShop.name}}</text>
		</view>
		
	</view>
	<view class="flex flexC bgff mx10 mt10 r3 px9 py7">
		<image class="icon" src="/static/img/icon/majiang.png" mode="aspectFill"></image>
		<text class="flex1 ml7">进店门禁</text>
		<text class="bg57 w42 fs30  r40 px9 py1"  @click="openDoor()">开大门</text>
	</view>
	<scroll-view scroll-y="true" class="list">
		<view v-for="(item,index) in list" :key="index" class="bgff m10 r3 p12 shadow">
			<view class="flex flexC flexB pb16">
				<text style="color: red;">距离保洁时间：{{item.min}}分钟</text>
				<text class="c57">{{item.status_txt}}</text>
			</view>
			<view class="flex flexC">
				<image class="w44" :src="item.logo" mode="aspectFill"></image>
				<view class="flex1 ml12 fs16">
					<view class="mb5">【{{item.shop_name}}】</view>
					<view>{{item.room_name}}</view>
				</view>
			</view>
			<view class="times mt9 c57 px15 py10 r9" >
				<view v-for="(sub,subIndex) in item.cleanList">
					<view class="fs16" v-if="subIndex == 0 && item.min != '0' "><text class="mr3">
						●</text>本订单结束：{{sub.start_time_text}}
					</view>
					
					<view class="fs16" v-if="subIndex == 0 && item.min == '0' "><text class="mr3">
						●</text>上个订单结束：{{sub.start_time_text}}
					</view>
					
					<view class="fs16" v-if="subIndex > 0  "><text class="mr3">
						●</text>下个订单结束：{{sub.start_time_text}}
					</view>
				</view>
				
			</view>
			<view class="flex flexC flexB pt16" v-if="item.isShow == 1">
				<text class="bg57 r7 p9 fs18" @click="open('room',item)">开门保洁</text>
			
				<text class="bg57 fs18 r7 p10"  @click="okDone(item)">完成保洁</text>
			</view>
		</view>
	</scroll-view>
	
	<!-- 店铺选择 -->
	<uni-popup ref="shopPicker" type="bottom">
		<shop-list @search="search" :list="shopList" @onSelectShop="onSelectShop" @close="onClose"></shop-list>
	</uni-popup>
	
	
	<tabbar></tabbar>
</view>
</template>

<script>
export default {
	data() {
		return {
			bindList: ["打扫状态", '待打扫', '打扫中', '已完成', '过期未打扫'],
			selectShop:null,
			list:[],
			shopList:[]
		};
	},

	onLoad(option) {
		this.getShopList();
		
	
	},
	onShow() {

	},

	methods: {
		
		onPullDownRefresh() {
		    that.getIndex();
		 },
		
		
		showShop() {
			this.$refs.shopPicker.open();
		
		},
		
		onSelectShop(item) {
			this.$refs.shopPicker.close();
			this.getIndex();
			
		},
		
		
		okDone(item){
			let param = {
				room_id: item.room_id,
				id:item.id
			};
			let that = this;
			this.$api.cleanDone(param).then(res => {
			
				console.info(JSON.stringify(res));
				uni.showToast({
					title:res.msg,
					icon:'none'
				})
				if (res.code == 1) {
					that.getIndex();
				} else {
			
				}
			})
		},
		
		getShopList() {
			let param = {
				keyword: this.keyword
			};
			let that = this;
			this.$api.getStaffShopList(param).then(res => {
		
				console.info(JSON.stringify(res));
				if (res.code == 1) {
					that.shopList = res.data;
					if (that.shopList.length > 0) {
						that.selectShop = that.shopList[0];
						that.getIndex();
					}
				} else {
		
				}
			})
		},
		
		openDoor(){
			let param = {
				type:'door',
				shop_id:this.selectShop.id
			};
			let that = this;
			this.$api.cleanOpen(param).then(res => {
			
				console.info(JSON.stringify(res));
				uni.showToast({
					title:res.msg,
					icon:'none'
				})
				if (res.code == 1) {
					
				} else {
			
				}
			})
		},
		
		open(type,item){
			let param = {
				room_id: item.room_id,
				type:type,
				id:item.id
			};
			let that = this;
			this.$api.cleanOpen(param).then(res => {
			
				console.info(JSON.stringify(res));
				uni.showToast({
					title:res.msg,
					icon:'none'
				})
				if (res.code == 1) {
					
				} else {
			
				}
			})
		},
		
		getIndex(){
			
			let param = {
				shop_id: this.selectShop.id
			};
			let that = this;
			this.$api.getCleanIndex(param).then(res => {
			
				console.info(JSON.stringify(res));
				if (res.code == 1) {
					that.list = res.data;
				
				} else {
			
				}
			})
		},
	}
}
</script>

<style lang="scss" scoped>
.room {
	.times {
		background-color: rgba(87, 109, 171, .2);
	}
	.w12 {
		width: 24rpx;
	}
	.c57 {color: #000;}
	.w44 {
		width: 88rpx;
		height: 88rpx;
	}
	.w42 {
		width: 220rpx;
		height: 64rpx;
		text-align: center;
		line-height: 64rpx;
	}
	.bg57 {background-color: #EC80A8; color: #fff;}
	.w72 {
		width: 144rpx;
		display: inline-block;
	}
	.icon {
		width: 30rpx;
		height: 42rpx;
	}
	.list {
		height: calc(100vh - 96rpx);
	}

	.add {
		position: fixed;
		bottom: 100px;
		right: 10rpx;
		width: 80rpx;
		height: 80rpx;
		line-height: 80rpx;
		border: 2rpx solid #EC80A8;
	}
}
 </style>
